<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Rico-Tree Control</title>

<link href="../client/css/demo.css" type="text/css" rel="stylesheet" />
<script src="../../src/prototype.js" type="text/javascript"></script>
<script src="../../src/rico.js" type="text/javascript"></script>
<script type='text/javascript'>
Rico.loadModule('Tree');
var tree1;

Rico.onLoad( function() {
  // initialize tree
  var options={
    showCheckBox : true,
    showLines    : false,
    showPlusMinus: false,
    showFolders  : true,
    leafIcon     : 'none'
  }
  tree1=new Rico.TreeControl("tree1", "NumberTree.asp", options);
  tree1.setTreeDiv('tree1');
  tree1.open();
});

function TreeClick1(e) {
  var items=tree1.getCheckedItems();
  var msg=items.length==0 ? 'No items are checked' : items.join('\n');
  alert(msg);
}
</script>

<style type="text/css">
div.ricoTree {
  background-color:#eeeedd;
  width:300px;
  height:300px;
  border:1px solid black;
  padding:4px;
}
</style>


</head>

<body>

<h2>Rico Tree Example #4</h2>

This example shows the tree control embedded in a page (i.e. not a pop-up).
Multiple items may be selected using the checkboxes next to each item.
The data is contrived -- the tree consists of all possible 5-digit numbers.
However, it does demonstrate a tree with many, many nodes.

<p><button id='TreeButton1' onclick='TreeClick1(event)'>Show Selections</button>

<p><div id='tree1' class='ricoTree'></div>

</body>
</html>
